/**
 * @Description:
 * @author 紫霞
 * @since 2019/1/17
 */
// React基础组件
import React from 'react'
// dva 连接组件 - 连接route和model
import { connect } from 'dva'
import FlagBtn from 'widget/FlagBtn/FlagView'
// 引入antd的组件
import { Row, Col, Card, Button, Tabs, Form, Popconfirm, Modal, } from 'antd'
//导入路由组件，用于跳转等
import { Link, hashHistory } from 'dva/router'
// 导入项目全局配置文件
import config from 'config/config'

// 引入model取值工具方法
import { mapStateToProps } from 'utils/view_utils'
//引用listPage
import ListPage from 'widget/PageTmpl/ListPage'
import cx from 'classnames'
// 当前组件样式
import styles from './commodityListStyle.less'
import { Grid, QueryCondition } from 'widget/Grid/index'
import { AdvanceSearch } from 'widget/CollapsiblePanels/index'
import Keypress  from 'widget/Keypress'
import { chunk } from 'lodash'

/**
 * description 路由视图及事件处理
 * dispatch 分发到models中的effects对应事件名
 * model 用于获取models中state定义的数据
 * form 表单对象
 */
const TabPane = Tabs.TabPane
const confirm = Modal.confirm;

const routeView = function ({ dispatch, model, form }) {

  const { resetFields, getFieldDecorator, validateFields, setFieldsValue } = form
  const { modelObj, namespace } = model
  let { areaList,standards,fileurl } = modelObj
  // 资讯详情页跳转
  function detailSkip(type, id = '') {
    hashHistory.push({
      pathname: '/home/commodity/commodityEidt/commodityEidt',
      query: { pageType:type, id }
    });
  }
  function showDeleteConfirm(id) {
    console.log(id)
    confirm({
      title: '您确定删除吗?',
      content: '删除后不可恢复',
      okText: '确定',
      okType: 'danger',
      cancelText: '取消',
      onOk() {

        dispatch({
          type: `${namespace}/delPremise`,
          payload: { productId: id }
        });
      },
      onCancel() {
        console.log('Cancel');
      },
    });
  }
  let pageProps = {
    ui: {
      "api_url": "admin/goods/list",
      "method": "POST",
      "app": "",
      "params": {},
      // "mockData": mockData,
      "mockData": null,
      search_bar: {
        fields: [
          {
            en_name: 'parentProductName',
            zh_name: '项目名称',
            elem_type: 'Input',
            elem_valid_type: 'string',
          },
          {
            en_name: 'name',
            zh_name: '商品名称',
            elem_type: 'Input',
            elem_valid_type: 'string',
          },
          {
            en_name: 'catalogId',
            zh_name: '商品类型',
            elem_type: 'Select',
            elem_valid_type: 'string',
            cmpt_items: [
              {
                value: '',
                label: '全部'
              },
              {
                value: '9004',
                label: '日用快消'
              },
              {
                value: '9005',
                label: '家电数码'
              },
              {
                value: '9006',
                label: '首饰箱包'
              },
              {
                value: '9009',
                label: '其他'
              }
            ]
          },
          {
            en_name: "validTime",
            zh_name: "创建日期",
            elem_type: "Date",
            format: "YYYY-MM-DD",
            width:300,
            // query_format: "YYYY-MM-DD HH:mm:ss",   // 请求参数, 当请求参数和显示时格式不同可通过该参数区分
            double: false,  // 日期范围组件 使用"YYYY-MM-DD HH:mm:ss"格式时, 显示不全时可使用该参数, 将占据两格位置
            split_keys: ['createStartTime','createEndTime'],
            elem_valid_type: "string"
          }

        ],
        searchHandler: () => { // 自定义搜索按钮回调函数，点击搜索时触发
          console.log('search click')
          //dispatch({ type: `${namespace}/updateStore`, payload: { queryList: [1, 2, 3, 4] } })
          dispatch({ type: `${namespace}/updateStore`, payload: { queryList: modelObj.biz.queryForm } })
        },
        resetHandler: () => { // 自定义重置按钮回调函数，点击重置时触发
          console.log('reset click')
        },
        searchCallback: params => { // 自定义搜索完成后的后调函数, 搜索完成后触发, 并将本次搜索的参数传入
          console.log('search finish', params)
        },
      },

      action_bar: [
        {
          label:'新建商品',
          type:'primary',
          btnId:'130104',
          onClick:(e,row)=>{
            detailSkip("add")
          }
        },
        {
          label:'导出商品信息',
          type:'primary',
          btnId:'130105',
          // render:()=>{
          //   return <a  onClick={()=>{
          //     dispatch({
          //           type: `${namespace}/exportFeedback`,
          //           payload: {}
          //         })
          //   }}></a>
          // }
          onClick: (e, row) => {
            dispatch({
              type: `${namespace}/exportFeedback`,
              payload: {}
            })
          }
        }
      ],
      // 数据表格
      "table":
          {
            "status_params": "status=0",
            "status_text": "全部",
            "scroll": { x: 1380 },
            "fields": [
              // {
              //   "en_name": "serialNumber",
              //   "zh_name": "活动编号编号",
              // },
              {
                "en_name": "productId",
                "zh_name": "商品编码",
                width:120,
              },
              {
                "en_name": "parentProvinceName",
                "zh_name": "所属城市",
                width: 130,
                
                render:(text,item,index)=>{
                  let arr = ['北京市','重庆','上海','天津']
                  if(arr.indexOf(text)>-1){
                    return text
                  }else{
                    return  <span>{`${text}${text && '-'}${item.parentCityName}`}</span>
                  }
                 
                }
              },
              {
                "en_name": "parentProductName",
                "zh_name": "所属项目",
                width: 100,
              },
              {
                "en_name": "pic",
                "zh_name": "商品图片",
                width:100,
                render:(text,item,index)=>{
                  if(text){
                    return <img style={{width:'80px',maxHeight:'50px'}} src={text}></img>
                  }
                }
              },
              {
                "en_name": "name",
                "zh_name": "商品名称",
                width:150,
              },
              {
                "en_name": "starder",
                "zh_name": "规格",
                width:120,
                render: (text, item, index) => {
                  for(let i in standards){
                    if(item[i]){
                      return <span>{standards[i]}:{item[i]}</span>
                    }
                  }
                }

              },
              {
                "en_name": "catalogId",
                "zh_name": "商品类型",
                width:100,
                render: (text, item, index) => {
                  if (text == '9004') {
                    return <span>日用快消</span>
                  }else if(text == '9005'){
                    return <span>家电数码</span>
                  }else if (text == '9006') {
                    return <span>首饰箱包</span>
                  }else{
                    return <span>其他</span>
                  }
                }
              },
              {
                "en_name": "price",
                "zh_name": "参考价格",
                width:100,
              },
              {
                "en_name": "createPerson",
                "zh_name": "创建人",
                width:100,
              },
              {
                "en_name": "createTime",
                "zh_name": "创建时间",
                // width:180,
              },
              {
                "en_name": "edit",
                "zh_name": "操作",
                fixed:'right',
                width:160,
                render: (a, item, index, d, e, f) => {
                  return (
                    <span className={styles.pot}>
                      <FlagBtn node={ <a onClick={() => showDeleteConfirm(item.productId)}>删除<span className="ant-divider" /></a>}
                      btnId={'130101'}
                      />
                      <FlagBtn node={ <a onClick={() => detailSkip('edit', item.productId)}>编辑<span className="ant-divider" /></a>}
                      btnId={'130102'}
                      />
                      <FlagBtn node={ <a onClick={() => detailSkip('detail', item.productId)}>查看</a>}
                      btnId={'130103'}
                      />
                    </span>
                  )
                },

              },
            ],
            // 表格操作
          },

    },
  }
  if (!!modelObj.biz) {
    pageProps.biz = modelObj.biz
    pageProps.biz.syncBackCbf = (biz) => {
      console.log(biz)
      dispatch({
        type: `${namespace}/updateStore`,
        payload: { biz }
      })
    }
  }
  return (
      <div className={cx('pageLayout')}>
        <div className={styles.table}>
          <ListPage pageProps={pageProps} />
        </div>
      </div>
  )
}

// 连接视图(view)和模型(model)
export default connect(mapStateToProps)(Form.create()(routeView))
